#@checkToken2()
<script type="text/javascript" src="#(path)/assets/js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="#(path)/assets/js/jquery.tmpl.min.js"></script> 
<script src="/assets/js/dateclick/WdatePicker.js"></script>
<link href="/assets/js/dateclick/skin/WdatePicker.css" rel="stylesheet" type="text/css">
<div style="width:880px;min-height:600px;">  
	<div align="left" style="width:880px;height:50px;"> 
		<div seleinfo1="holding" align="center" class="userinvest userinvest2" >持有中</div>
		<div seleinfo1="finish" align="center" style="background:#f4f5fa;" class="userinvest2 " >已还款</div>
	</div>
	<!--时间筛选-->
	<div align="left" style="background:#FFF;line-height:50px;height:50px;width:880px;">
		<span style="margin:0 0 0 20px;">时间范围：</span>
		<span seleinfo1="" class="invest invest_time1 invest_time">全部</span> 
		<span seleinfo1="30" class="invest invest_time1 ">1个月</span> 
		<span seleinfo1="90" class="invest invest_time1">3个月</span> 
		<span seleinfo1="180" class="invest invest_time1">6个月</span>
		<input placeholder="选择开始时间" id="startime" onclick="WdatePicker()" style="background:url(#(path)/assets/home/account/timelogo.png) no-repeat;background-position:120px 5px; padding:0 10px;width:150px;border:1px solid #e8e8e8;border-radius:5px;height:30px;">
		<span class="invest "> - </span>
		<input placeholder="选择截止时间" id="endtime" onclick="WdatePicker()" style="background:url(#(path)/assets/home/account/timelogo.png) no-repeat;background-position:120px 5px; padding:0 10px;width:150px;border:1px solid #e8e8e8;border-radius:5px;height:30px;">
		<span class="yuefen yuefens">确定</span>
	</div>
	<!--标的列表-->
	<div align="left" style="padding:10px 20px 20px 20px;;width:840px;height:600px;background:#FFF;">
		<div style="line-height:50px;font-size:14px;height:550px;">
			<div align="left" style=" border-bottom:1px dashed #e0e0e0;height:50px;background:#fafafa">
				<div style="float:left;width:100px;margin-left:20px;">项目名称</div>
				<div style="float:left;width:80px;">预期年化</div>
				<div style="float:left;width:90px;">投资金额</div>
				<div style="float:left;width:90px;">预期收益</div>
				<div style="float:left;width:130px;">投资时间</div> 
				<div style="float:left;width:130px;">起息时间</div>
				<div style="float:left;width:130px;">还款时间</div>
				<div style="float:left;width:70px;">状态</div>
			</div>
			<div id="tradeall">
				
			</div>
		</div>
		<!--分页-->
		<div align="center" style="font-size:14px;height:50px;width:100%;padding-bottom:10px;background:#FFF;line-height:50px;">
			<span id="firstpage" style="cursor:pointer;padding:5px 10px 5px 10px;border:1px solid #ebebeb;border-radius:5px 0 0 5px;">
				首页
			</span>
			<span id="backpage" style="cursor:pointer;padding:5px 10px 5px 10px;border:1px solid #ebebeb;">
				上一页
			</span>
			<span style="padding:5px 10px 5px 10px;border:1px solid #ebebeb;">
				第<span id="pageNumber"></span>页&nbsp&nbsp共<span id="totalPage"></span>页
			</span>
			<span id="nextpage" style="cursor:pointer;padding:5px 10px 5px 10px;border:1px solid #ebebeb;">
				下一页
			</span>
			<span id="lastpage" style="cursor:pointer;padding:5px 10px 5px 10px;border:1px solid #ebebeb;border-radius:0 5px 5px 0;">
				尾页
			</span>
			<span style="margin-left:50px;">第</span>
			<input id="pagenum" style="border:1px solid #ebebeb;border-radius:5px;height:32px;width:40px;padding:0 10px 0 10px;font-size:16px;"  /> 
			<span>页</span>
			<span id="gopage" style="cursor:pointer;padding:5px 10px 5px 10px;border:1px solid #ebebeb;border-radius:5px;">
				跳转
			</span>
		</div>
	</div>
</div>
<script id="demo" type="text/x-jquery-tmpl">
	<div align="left" style="border-bottom:1px dashed #e0e0e0;height:50px;">
		<div class="onellipsis" style="float:left;width:120px;color:#fa4357">${name}</div>
		<div style="float:left;width:80px;">${rate}%+${plus_rate}%</div>
		<div style="float:left;width:90px;">￥${amount}</div>
		<div style="float:left;width:90px;">￥${total}</div>
		<div class="onellipsis" style="float:left;width:110px;padding:0 20px 0 0;">${start_time}</div>
		<div class="onellipsis" style="float:left;width:110px;padding:0 20px 0 0;">${invest_start_time}</div>
		<div class="onellipsis" style="float:left;width:110px;padding:0 20px 0 0;">${invest_end_time}</div>
		<div style="float:left;width:70px;">${status}</div> 
	</div>
</script>
<script>
	var day_limit ="";
	var createTimeStart="";      
	var createTimeStart="";      
	var createTimeEnd="";
	var types = "holding";
	var pageNumber = "";
	var page = 1;
	var totalPage = "";
	//时间筛选--
	mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
	$(".invest_time1").click(function(){
		$(".invest_time1").removeClass("invest_time"); 
		$(this).addClass("invest_time");
		day_limit = $(this).attr("seleinfo1");
		$("#tradeall").empty();
		page = 1;
		mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
	});
	$(".yuefen").click(function(){
		createTimeStart=$("#startime").val();
		createTimeEnd=$("#endtime").val();
		$("#tradeall").empty();
		mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
	});
	//持有与已完成转换
	$(".userinvest2").click(function(){
		$(".userinvest2").removeClass("userinvest"); 
		$(".userinvest2").css("background","#f4f5fa");
		$(this).addClass("userinvest");
		$(this).css("background","#FFF");
		types = $(this).attr("seleinfo1");
		$("#tradeall").empty();
		mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
		
	});
	//上一页
	$("#backpage").click(function(){
		page = page-1;
		if(page <= 0){
			layer.msg("当前已是首页！",{icon:2,time:1000}); 
		}else{
			$("#tradeall").empty();
			mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
		}
	}); 
	//下一页
	$("#nextpage").click(function(){
		page = page + 1;
		if(page > totalPage){
			layer.msg("当前已是尾页！",{icon:2,time:1000}); 
		}else{
			$("#tradeall").empty();
			mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
		}
	}); 
	//首页
	$("#firstpage").click(function(){
		page = 1;
		$("#tradeall").empty();
		mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
	}); 
	//尾页
	$("#lastpage").click(function(){
		page = totalPage;
		$("#tradeall").empty();
		mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
	});  
	//跳转
	$("#gopage").click(function(){
		page = $("#pagenum").val();
		if(page > totalPage || page < 1 ){
			layer.msg("输入页数不在区间内！",{icon:2,time:1000}); 
		}else{ 
			$("#tradeall").empty();
			mytradelist(types,page,day_limit,createTimeStart,createTimeEnd);
		}
	});
	function mytradelist(types,page,day_limit,createTimeStart,createTimeEnd){
		$.getJSON("#(path)/trade/myList?token=#(session.token??)&status="+types+"&size=9&page="+page+"&dayLimit="+day_limit+"&createTimeStart="+createTimeStart+"&createTimeEnd="+createTimeEnd, function(datalist) {
			console.log(datalist);
			totalPage = datalist.data.page.totalPage;
			pageNumber = datalist.data.page.pageNumber;
			if(totalPage==0){
				totalPage = 1;
			}
			if(pageNumber==0){
				pageNumber = 1;
			}
			$("#totalPage").html(totalPage);
			$("#pageNumber").html(pageNumber); 
			$.each(datalist.data.page.list, function(i, item){ 
				console.log(item);
				if(item.status=="trading"){
					status="投资中";
				}else if(item.status=="repaying"){
					status="还款中";
				}else if(item.status=="finish"){
					status="已还款";
				}
				var invests = {status:status,invest_start_time:item.invest_start_time,start_time:item.start_time,total:item.total,invest_end_time:item.invest_end_time,name:item.name,id:item.id,rate:item.rate,plus_rate:item.plus_rate,amount:item.amount};
				$("#demo").tmpl(invests).appendTo('#tradeall');
			});
			 
			$(".dropload-down").css("height","0px"); 
			if(!datalist.data.page.lastPage){
				me.resetload();	
			}
		});
	}
</script>
